<template>
    <div>
        <Content :style="{ minHeight: '480px', background: '#fff'}">
            <Breadcrumb :style="{margin: '16px 0'}">
                <BreadcrumbItem>购物中心</BreadcrumbItem>
                <BreadcrumbItem>{{ selectMenu }}</BreadcrumbItem>
            </Breadcrumb>
            <Layout>
                <Sider hide-trigger :style="{background: '#fff'}">
                    <Menu theme="light" active-name="主页" width="auto" @on-select="setSelectMenu">
                        <MenuItem name="主页" to="/ProductShow">主页</MenuItem>
                        <MenuItem name="我的购物车" to="/ProductCart">我的购物车</MenuItem>
                        <MenuItem name="我也要卖东西~" to="/ProductAdd">我也要卖东西~</MenuItem>
                    </Menu>
                </Sider>
                <Content :style="{padding: '24px', minHeight: '620px', background: '#fff'}">
                    <router-view></router-view>
                </Content>
            </Layout>
        </Content>
    </div>
</template>

<script>
    // import globalData from "@/utils/globalData";
    export default {
        name: "ProductCenter",
        data() {
            return {
                selectedMenu: "主页"
            }
        },
        created:function () {

        },
        methods: {
            setSelectMenu(val) {
                this.selectMenu = val
            }
        }
    }
</script>

<style scoped>

</style>